<template>
	<!-- 订单待评价详情 -->
	<view class="pay">
		<view class="myorder">
			<view class="orderList">
				<view class="title">
					已收货，快去评价一下吧
				</view>
				<view class="shalllList">
                  2023/03/02 17:39
				</view>
			</view>
		<view class="InfoListloft">
			<view class="InfoList">
				<!-- 导航-->
				<view class="kong">
					<u-steps current="3" dot activeColor="red">
						<u-steps-item title="待付款" style='width: 130px;font-size: 16px;'></u-steps-item>
						<u-steps-item title="待发货" ></u-steps-item>
						<u-steps-item title="待收货" ></u-steps-item>
						<u-steps-item title="待评价" ></u-steps-item>
						<u-steps-item title="已完成"></u-steps-item>
					</u-steps>
				</view>
			</view>
			<view class="goodorderes">
				<template v-for="(item,index) in arrayList">
					<my-order :key="index" :orderList="item" v-show="arrayList.length"></my-order>
				</template>
			</view>
				
		</view>
		</view>
	  <view class="footer-order">
	  	<!-- 退款/查看物流-->
	  		<view class="refund" @click="getsubmit">
	  			申请退款
	  		</view>
	  		<view class="refund">
	  			查看物流
	  		</view>
	  </view>
	</view>
</template>

<script>
	import ordergoodsinfo from '../../components/order/ordergoodsinfo.vue'
	export default{
		components:{
			"my-order":ordergoodsinfo
		},
		data(){
			return{
				arrayList:[{
					name:'nini',
					photo:13511888888,
					price:129.00,
					address:'陕西省西安市未央区12345',
					num:1,
					address2:'2222',
					total:798.00,
					pingjia:'去评价'
					
				}]
			}
		},
		methods: {
			getsubmit() {
				uni.navigateTo({
					url: "/pages/orderinfo/refundorder"
				})
			}
		}
	}
</script>

<style lang="scss">
	.orderList {
		background-color: rgb(233, 52, 55);
		color: white;
		height: 180rpx;
		padding: 20px 20px;
		font-size: 16px;
		text-align: center;

		.title {
			font-weight: bold;
			margin-bottom: 10px;

		}

		.shalllList {
			text-align: center;
		}
		


	}
.InfoListloft{
background-color: #ebebeb;
height:89vh;
.goodorderes{
	margin-top: -20px;
}
}
	.InfoList {
		border-radius: 10px;
		background-color: white;
		position: relative;
		top: -35px;
		left: 0px;
		display: flex;
		height: 70px;
		width: 90%;
		margin: auto;
		
		font-size: 8px;
		.kong{
			margin: auto;
		}

	}
	.footer-order{
		display: flex;
		width: 100vw;
		background-color: white;
		height: 60px;
		padding-top:20px ;
		padding-left:130px;
		.refund{
			border: 1px solid #ccc;
			height: 30px;
			line-height: 30px;
			text-align: center;
			width: 100px;
			border-radius: 25px;
			color: #ccc;
			margin-right: 10px;
		}
		
	}
	
</style>
